<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>修德抄经堂</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <link rel="stylesheet" type="text/css" href="../bower_components/mui/dist/css/mui.min.css">
    <link rel="stylesheet" type="text/css" href="../css/base.css">
    <link rel="stylesheet" type="text/css" href="../css/full.css">
    <link rel="stylesheet" type="text/css" href="../css/zhifu.css">
</head>

<body>
    <div class="page">
        <!--<header class="mui-bar mui-bar-nav title">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"><span>返回</span></a>
	      	<h1 class="mui-title">道德抄经堂</h1>
        </header>-->
        <div class="content">
            <div class="order">
                <table>
                    <tr>
                        <td class="tb_left" id="typeset_name">
                            <!-- <p>坚版竖字</p> -->
                        </td>
                        <td class="tb_right" id="typeset_price">
                            <!-- <p>￥2.00</p> -->
                        </td>
                    </tr>
                    <tr>
                        <td class="tb_left" id="bind_name">
                            <!-- <p>线装</p> -->
                        </td>
                        <td class="tb_right" id="bind_price">
                            <!-- <p>￥2.00</p> -->
                        </td>
                    </tr>
                    <tr>
                        <td class="tb_left" id="material_name">
                            <!-- <p>黄裱纸</p> -->
                        </td>
                        <td class="tb_right" id="material_price">
                            <!-- <p>￥2.00</p> -->
                        </td>
                    </tr>
                    <tr>
                        <td class="tb_left" id="font_color_name">
                            <!-- <p>金色</p> -->
                        </td>
                        <td class="tb_right" id="font_color_price">
                            <!-- <p>￥2.00</p> -->
                        </td>
                    </tr>
                    <tr>
                        <td class="tb_left" id="sutra_edition_name">
                            <!-- <p>《心经王羲之行书版》</p> -->
                        </td>
                        <td class="tb_right" id="sutra_edition_price">
                            <!-- <p>￥2.00</p> -->
                        </td>
                    </tr>
                </table>
                <div class="total" id="total_price">
                    <!-- <p>总计：￥8.00</p> -->
                </div>
            </div>
            <div class="button">
                <div class="single_button left">
                    <a href="#">
	    				<button class="cover cancle">取消</button>
	    			</a>
                </div>
                <div class="single_button right">
                    <button class="cover ok" id="payit">结算</button>
                </div>
            </div>
        </div>
    </div>
</body>
<script src="../bower_components/mui/dist/js/mui.min.js"></script>
<script src="../bower_components/jquery/dist/jquery.min.js"></script>
<script>
    $(function() {
        function getCookie(name) {
            var arr = document.cookie.match(new RegExp("(^| )" + name + "=([^;]*)(;|$)"));
            if (arr != null) return unescape(arr[2]);
            return null;
        }
        var csrftoken = getCookie('csrftoken');
        var versionId = localStorage.getItem('versionId');
        var msg1 = localStorage.getItem('message');
        var msg2 = JSON.parse(msg1);
        var bookId = localStorage.getItem('bookID');

        var configData, payData, totalPrice;
        // 获取当前URL，并除去#内容
        var currentUrl = window.location.href.split('#')[0];
        $.when(

            // 获取config数据
            $.ajax({
                url: '/fe/user/js_sign',
                type: 'POST',
                beforeSend: function(xhr, settings) {
                    xhr.setRequestHeader("X-CSRFToken", csrftoken);
                },
                data: {
                    "url": currentUrl,
                },
                success: function(data) {
                    configData = data.data;
                },
                error: function(xhr, status, error){
                        if (xhr.status == 403 ){
                            $.ajax({
                                url: '/fe/user/login',
                                success: function (data) {
                                    console.log(data);
                                    location.href = data.url;
                                },
                                error: function (error) {
                                    console.log('no');
                                    console.log(error);
                                }
                            });

                        }
                    }
            })

        ).then(function() {
        $('.left>a>button').click(function () {
            window.location.href="jingshujieshao.html?id="+bookId;
        })

        $.ajax({
            url: '/fe/transcript/sutra_edition/' + versionId + '/order_preview',
            type: 'GET',
            beforeSend: function(xhr, settings) {
                xhr.setRequestHeader("X-CSRFToken", csrftoken);
            },
            data: {
                "typeset_id": msg2.typesetId,
                "material_id": msg2.materialId,
                "bind_id": msg2.bindId,
                "font_color_id": msg2.colorId,
            },
            success: function(data) {
                console.log(data);

                $("#sutra_edition_name").html(
                    "<p>《" + data.data.sutra_edition_name + "》</p>")
                $("#sutra_edition_price").html(
                    "<p>￥" + data.data.sutra_edition_price + "</p>")

                $("#typeset_name").html(
                    "<p>" + data.data.typeset_name + "</p>")
                $("#typeset_price").html(
                    "<p>￥" + data.data.typeset_price + "</p>")
                $("#material_name").html(
                    "<p>" + data.data.material_name + "</p>")
                $("#material_price").html(
                    "<p>￥" + data.data.material_price + "</p>")
                $("#font_color_name").html(
                    "<p>" + data.data.font_color_name + "</p>")
                $("#font_color_price").html(
                    "<p>￥" + data.data.font_color_price + "</p>")
                $("#bind_name").html(
                    "<p>" + data.data.bind_name + "</p>")
                $("#bind_price").html(
                    "<p>￥" + data.data.bind_price + "</p>")

                var price = data.data.total_price;

                $("#total_price").html(
                    "<p>总计： ￥" + price + "</p>")

                $('#payit').click(function() {
                    location.href = 'pay.html?price=' + price + '';
                })
            }
        })
    });
        });
</script>
<script src="../js/common.js"></script>

</html>
